<template>
	<view :class="uiStyle == 1 ? '' : 'uiStyle'" >
				<view class="head-block" v-if="weixin == 2">
				     <view class="nav-title" :style="'top:10px'"></view>
					 <!-- 返回 -->
					 <view class="icon" @tap="goMy" :style="'top:6px'">
					      <van-icon name="arrow-left" color="#333" size="45rpx" />
					  </view>
				 </view>
		<!-- v2.5新版本的编辑个人资料页 -->
		<view>
			<view>
				<van-cell title="头像" is-link>
					<image v-if="!faceImageUrl" src="../../static/assets/img/user/tx.png"
						style="width: 60rpx; height: 60rpx" @click="uplodaImg" />
				   <image v-else :src="faceImageUrl" style="width: 60rpx; height: 60rpx" @click="uplodaImg" />
				</van-cell>
				<van-cell title="昵称" is-link>
					<input type="text" maxlength="15" placeholder="点击填写昵称" confirm-type="done" :value="username"
						@blur="changeName" @confirm="changeName" />
				</van-cell>
				<view class="splitLine"></view>
				<van-cell title="手机号">
					{{ phoneNumber }}
				</van-cell>
				<van-cell title="认证状态">已认证</van-cell>
			</view>
			<view class="out-btn" @tap="Loginout" >退出登录</view>
		</view>
		<van-dialog id="van-dialog" confirm-button-color="#00BCAB" />
	</view>
</template>

<script>
	// pages/newChangeUser/newChangeUser.js
	import util from './../../utils/util.js';
	import api from './../../utils/api.js';
	import {
		Dialog
	} from 'vant';
	export default {
		data() {
			return {
				username: '',
				phoneNumber: '',
				plateNos: '',
				faceImageUrl: '',
				url: '',
				//头像没改就传空，改了就需要重置为该路径
				fileList: [],
				weixin:0,
				uiStyle:1,
				weixin:uni.getStorageSync('weixin')
			};
		}
		/**
		 * 生命周期函数--监听页面加载
		 */
		,
		onLoad: function(options) {
			this.uiStyle = uni.getStorageSync('uiStyle')
			uni.showLoading({
				title: '加载中'
			});
			this.weixin = uni.getStorageSync('weixin')
			this.getPersonInfoByIndentityId();
		},
		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},
		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {},
		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},
		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},
		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh: function() {},
		/**
		 * 页面上拉触底事件的处理函数
		 */
		// onShareAppMessage: function () {
		// }
		onReachBottom: function() {},
		/**
		 * 用户点击右上角分享
		 */
		methods: {
			goMy() {
					     uni.navigateBack({
					         delta: 1
					     });
					 },
			//获取个人资料
			getPersonInfoByIndentityId() {
				uni.hideLoading();
				let value = uni.getStorageSync('unionId');
				util.request(api.PersonInfoByIndentityId + '?personUnionId=' + value, 'get').then((res) => {
					if (res.code == 0) {
						var pat = /(\d{3})\d*(\d{4})/;
						this.setData({
							username: res.data.name,
							// phoneNumber: res.data.phoneNumber.replace(pat, "$1****$2"),
							phoneNumber: res.data.phoneNumber,
							plateNos: res.data.plateNos
						});
					} //头像转化

					if (res.data.headImageUrl) {
						util.request(api.getEncryPath + '?path=' + res.data.headImageUrl, '', 'POST').then((
							res) => {
							this.setData({
								faceImageUrl: res
							});
						});
					}
				});
			},

			// 修改昵称--手机上点击完成按钮才触发
			changeName(e) {
				if (!e.detail.value.replaceAll(' ', '')) {
					uni.showToast({
						title: '昵称不能为空',
						icon: 'none'
					});
					return;
				}

				this.setData({
					username: e.detail.value
				});
				this.setupdateUser();
			},
			uplodaImg() {
				let that = this;
				uni.chooseImage({
					count: 1, // 默认最多一次选择9张图
					success: res => {
						console.log(res)
						uni.showLoading()
						uni.uploadFile({
							url: api.vueUpload,
							filePath: res.tempFilePaths[0],
							name: 'file',
							formData: {
								user: 'test'
							},
							header: {
								Authorization: uni.getStorageSync('AUTHORIZATION') //如果需要token的话要传
							},
							success: item => {
								if (item.statusCode == 200) {
									var data = JSON.parse(item.data);
									console.log(data)
									uni.showToast({
										title: '上传成功'
									})
									uni.hideLoading()
									that.setData({
										url: data.data
									});
									that.setupdateUser();
									if (data.data) {
										//这个步骤是为了展示上传的图片
										util.request(api.getEncryPath + '?path=' + data.data, '',
											'POST').then((res) => {
											// that.setData({ fileList: [{ url: res }] });
											// console.log(res)
											that.setData({
												faceImageUrl: res
											});
											uni.setStorageSync('faceImageUrl', res);
										});
									}
								} else {
									uni.showToast({
										title: '上传失败，请重新上传',
										icon: 'error'
									})
								}
							},
							fail: (err) => {
								console.log('uploadImage fail', err);
								uni.showToast({
									title: '上传失败，请重新上传',
									icon: 'error'
								})
							}
						})
					}
				})
			},
			// 提交修改
			setupdateUser() {
				const identityId = uni.getStorageSync('identityId');
				const param = {
					loginName: uni.getStorageSync('phoneNumber'),
					name: this.username,
					url: this.url,
					plates: this.plateNos,
					identityId: identityId
				};
				util.request(api.updateUser, param, 'POST').then((res) => {
					if (res.code == 0) {
						uni.showToast({
							title: '修改成功',
							icon: 'none'
						});
						uni.setStorage({
							key: 'name',
							data: this.username
						});
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						});
					}
				});
			},

			// 登出
			Loginout() {
				Dialog.confirm({
						context: this,
						message: '确定退出账号？'
					})
					.then(() => {
						// on confirm
						// wx.setStorage({ key: "phoneNumber", data: this.data.value }); //手机号
						// wx.setStorage({ key: "sms", data: this.data.sms }); //手机号
						uni.removeStorageSync('name');
						// uni.removeStorageSync('phoneNumber');
						uni.removeStorageSync('plateNos');
						uni.removeStorageSync('faceImageUrl');
						uni.removeStorageSync('status');
						uni.removeStorageSync('sms');
						uni.removeStorageSync('AUTHORIZATION');
						uni.removeStorageSync('identityId');
						uni.removeStorageSync('unionId');
						if(uni.getStorageSync('weixin') == 2){
							jWeixin.miniProgram.redirectTo({
								url: "/pages/login/login"
							})
						}else if(this.weixin == -1){
							uni.redirectTo({
								url: '../login/index'
							});			
						}
					})
					.catch(() => {
						// on cancel
					});
			}
		}
	};
</script>
<style>
	@import './newChangeUser.css';
</style>
